<template>
  <div class="test-consultation-order">
    <h1>问诊单管理测试页面</h1>
    
    <div class="test-section">
      <h2>筛选功能测试</h2>
      <div class="filter-test">
        <input v-model="testParams.patientNameOrPhone" placeholder="患者姓名或手机号" />
        <select v-model="testParams.status">
          <option value="">全部状态</option>
          <option value="0">待支付</option>
          <option value="1">进行中</option>
          <option value="2">已完成</option>
          <option value="3">已取消</option>
          <option value="4">已退诊</option>
        </select>
        <button @click="testFilter">测试筛选</button>
      </div>
    </div>

    <div class="test-section">
      <h2>API测试</h2>
      <div class="api-test">
        <button @click="testGetList">测试获取列表</button>
        <button @click="testGetStatistics">测试获取统计</button>
        <button @click="testDelete">测试删除</button>
      </div>
    </div>

    <div class="test-section">
      <h2>结果显示</h2>
      <pre>{{ testResult }}</pre>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const testParams = ref({
  patientNameOrPhone: '',
  status: '',
  pageIndex: 1,
  pageSize: 10
})

const testResult = ref('')

const testFilter = () => {
  testResult.value = `筛选参数: ${JSON.stringify(testParams.value, null, 2)}`
}

const testGetList = async () => {
  try {
    const response = await fetch(`http://localhost:5242/api/ConsultationOrder/list?${new URLSearchParams({
      pageIndex: '1',
      pageSize: '10'
    })}`)
    const data = await response.json()
    testResult.value = `获取列表成功: ${JSON.stringify(data, null, 2)}`
  } catch (error) {
    testResult.value = `获取列表失败: ${error}`
  }
}

const testGetStatistics = async () => {
  try {
    const response = await fetch('http://localhost:5242/api/ConsultationOrder/statistics')
    const data = await response.json()
    testResult.value = `获取统计成功: ${JSON.stringify(data, null, 2)}`
  } catch (error) {
    testResult.value = `获取统计失败: ${error}`
  }
}

const testDelete = async () => {
  try {
    const response = await fetch('http://localhost:5242/api/ConsultationOrder/1', {
      method: 'DELETE'
    })
    const data = await response.json()
    testResult.value = `删除测试: ${JSON.stringify(data, null, 2)}`
  } catch (error) {
    testResult.value = `删除失败: ${error}`
  }
}
</script>

<style scoped>
.test-consultation-order {
  padding: 20px;
}

.test-section {
  margin-bottom: 30px;
  padding: 20px;
  border: 1px solid #ddd;
  border-radius: 8px;
}

.filter-test {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}

.filter-test input,
.filter-test select {
  padding: 8px;
  border: 1px solid #ddd;
  border-radius: 4px;
}

.filter-test button {
  padding: 8px 16px;
  background: #1890ff;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

.api-test {
  display: flex;
  gap: 10px;
}

.api-test button {
  padding: 8px 16px;
  background: #52c41a;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

pre {
  background: #f5f5f5;
  padding: 15px;
  border-radius: 4px;
  overflow-x: auto;
  white-space: pre-wrap;
  word-wrap: break-word;
}
</style> 